import UsersApi from "../../api/users.js";
import Base from "../base.js";

export default class extends Base {
    render() {
        this.$el.html(`
        <div class="content">
            <div class="form-content">
                <div><h1>登录</h1></div>
                <div class="layui-form-item">
                    <input type="text" name="username" placeholder="请输入账号" class="layui-input">
                </div>
                <div class="layui-form-item">
                    <input type="password" name="password" placeholder="请输入密码" class="layui-input">
                </div>
                <div class="allbtn">
                    <button class="loginBtn layui-btn">登录</button>
                    <button class="regBtn layui-btn layui-btn-primary">注册</button>
                </div>
            </div>
        </div>
        `);
        this.$loginBtn = $(".loginBtn");
        this.$regBtn = $(".regBtn");
        this.$content = $(".content");
    }
    handle() {
        this.$loginBtn.on("click", async e => {
            const username = $("input[name=username]").val();
            const password = $("input[name=password]").val();
            if (username && password) {
                const data = await UsersApi.login({ username, password });
                if (data._id) {
                    layui.layer.msg("登录成功");
                    console.log(data);
                    location.hash = "#/info/student";
                } else if (data) {
                    layui.layer.msg("密码输入错误");
                } else {
                    layui.layer.msg("用户不存在");
                }
            } else {
                layui.layer.msg("请输入完整信息");
            }
        });
        this.$regBtn.on("click", e => {
            location.hash = "#/reg";
        });
    }
}